<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>家有汇首页</title>
		<link rel="stylesheet" type="text/css" href="css/index.css" />
	</head>

	<body>
	<div class="bigbox">
		<!--首页上部-->
		<div class="top" ></div>
		<!--轮播图-->
		<div class="image">
			<!--左边的轮播图-->
			<div class="rotating">
				<!--三张图片-->
				<ul class="big_img">
					<li>
						<img src="img/current4.jpg">
					</li>
					<li>
						<img src="img/current1.jpg">
					</li>
					<li>
						<img src="img/current2.jpg">
					</li>
				</ul>
			</div>
				<!--右边的今日特价-->
				<div class="discount">
					<!--今日特价标题-->
					<div class="title">今日特价</div>
					<!--特价商品-->
					<div class="commodity">
						<!--左边，商品说明-->
						<div class="illustrate">
							<ul>
								<!--现在价格-->
								<li class="current_price">￥299.00</li>
								<!--原来价格-->
								<li class="original_price">￥598.00</li>
								<!--商品名-->
								<li class="tradeName">ACA特供彩钢面包机</li>
								<!--商品介绍-->
								<li class="intruduction">全新彩钢升级版，21项功能</li>

							</ul>
						</div>
						<!--右边，商品图片-->
						<div class="picture"></div>
					</div>
					<!--联系电话-->
					<div class="tel">
						<!--电话图片-->
						<div class="pic_tel"></div>
						<!--电话号码-->
						<div class="telNumber">4007-678-888</div>
					</div>
					<!--其他的服务-->
					<div class="serve">
						<ul>
							<!--直播节目表-->
							<li>
								<img src="img/live_boardcast.jpg">
							</li>
							<!--掌上购物-->
							<li>
								<img src="img/mobil_shopping.jpg">
							</li>
							<!--物流查询-->
							<li>
								<img src="img/logistic.jpg">
							</li>
							<!--会员中心-->
							<li>
								<img src="img/vip_center.jpg">
							</li>
						</ul>
					</div>
				</div>
			</div>
		<!--TV直播-->
		<div class="TVlive">
			<div class="tvlive">TV直播</div>
			<!--水平线+查看更多-->
			<div class="line"></div>
			<span class="more">查看更多></span>

			</span>
		</div>
		<!--中间部分的大图片-->
		<div class="middle">
			<!--中间图片第一行-->
			<div class="middle_one">
				<ul>
					<!--第一行第一张-->
					<li class="mid_one_one">
						<!--第一行第一张左边的商品介绍-->
						<div class="commodity_introduction">
							<ul class="laobaicha">
								<li class="living">正在直播中...</li>
								<li class="time">16:55-17:55</li>
								<li class="intr">广东福5年陈福鼎老白茶养生组</li>
								<li class="special">产地正宗 生长条件优越，口香浓郁</li>
								<li class="price">
									<div class="current_price">￥598.00</div>
									<div class="original_price">￥897.00</div>
								</li>
							</ul>
						</div>
						<!--第一行第一张右边的右边的图片-->				
						<div class="pic">
							<img src="img/middle/laobaicha.jpg" />
						</div>
					</li>
					<!--第一行第二张-->
					<li class="img">
						<img src="img/middle/mid_1.jpg" />
					</li>
					<!--第一行第三张-->
					<li class="img">
						<img src="img/middle/mid_2.jpg" />
					</li>
					<!--第一行第四张-->
					<li class="img">
						<img src="img/middle/mid_3.jpg" />
					</li>
				</ul>
			</div>
			<!--中间图片第二行-->
			<div class="middle_two">
				<!--第二行第一列的两张图片-->
				<div class="middle_two1">
					<img src="img/middle/mid_4.jpg" />
					<img src="img/middle/mid_5.jpg" />
				</div>
				<!--第二行第二列的一张图片-->
				<img class="middle_two2" src="img/middle/mid_6.jpg" />
				<!--第二行第三列的两张图片-->
				<div class="middle_two3">
					<img src="img/middle/mid_7.jpg" />
					<img style="margin-top: 5px;" src="img/middle/mid_8.jpg" />
				</div>
				<!--第二行第四列的两张图片-->
				<div class="middle_two4">
				<!--第二行第四列的第一张二维码-->
					<div class="middle_two41">
						<img style="width: 243px;" src="img/middle/mid_9.jpg" />
						<img style="margin: 10px auto auto 45px;" src="img/middle/mid_10.jpg" />
					</div>
					<!--第二行第四列的下面的公告-->
					<div class="middle_two42">
						<ul>
							<li class="notice">家有公告</li>
							<li>大清仓！家有购物清仓惠</li>
							<li>9月秋风颂 加湿送温暖</li>
							<li>家有开学季 寓教于乐更快乐</li>
							<li>七夕不是一个人的孤单 是一群段令人难忘人的狂欢</li>
							<li>健康完美生活，首选家有购物</li>
						</ul>
					</div>
				</div>
			</div>
			<!--中间图片第三行的十张图片-->		
			<div class="middle_three">
				<img src="img/middle/mid_11.jpg" />
				<img src="img/middle/mid_12.jpg" />
				<img src="img/middle/mid_13.jpg" />
				<img src="img/middle/mid_14.jpg" />
				<img src="img/middle/mid_15.png" />
				<img src="img/middle/mid_16.jpg" />
				<img src="img/middle/mid_17.jpg" />
				<img src="img/middle/mid_18.jpg" />
				<img src="img/middle/mid_19.jpg" />
				<img src="img/middle/mid_20.jpg" />
			</div>
			<!--中间图片第四行-->
			<div class="middle_four">
				<img class="middle_four1" src="img/middle/mid_41.png" />
				<img class="middle_four2" src="img/middle/mid_42.jpg" />
				<img class="middle_four2" src="img/middle/mid_43.jpg" />
				<img class="middle_four2" src="img/middle/mid_44.jpg" />
				<img class="middle_four2" src="img/middle/mid_45.jpg" />
				<img class="middle_four2" src="img/middle/mid_46.jpg" />
				<img class="middle_four2" src="img/middle/mid_47.jpg" />
			</div>
		</div>
		<!--底部-->
		<div class="bottom">
			
		</div>

	

	

	</div>
	</body>

</html>

<script src="js/jquery-2.1.0.js"></script>
<script src="js/js_index.js"></script>
<script src ="js/bottom.js"></script>
<script src ="js/top.js"></script>
